<template>
  <view>
	<view :style="masking" class="masking" @click="loginModel()"></view>
    <view class="top_bgk"> </view>
    <view class="person_card">
      <view @click="hrefDetail" class="person_photo" :style="'background-image: url(' + user.photo + ');'">
      </view>
      <view class="person_message">
        <text class="person_name">{{ user.xming0 }}</text>
        <view class="person_sex">
          <image
            v-if="user.xbie00 == 1"
            style="width: 26px; height: 26px; background-color: #ffffff"
            src="../../static/person/337@2x.png"
          />
          <image
            v-if="user.xbie00 == 2"
            style="width: 26px; height: 26px; background-color: #ffffff"
            src="../../static/person/316@2x.png"
          />
        </view>
      </view>
      <view class="card">
        <text v-if="user.sfzh00">卡号：{{ user.sfzh00 }}</text>
		<h2 v-else>您还未登录</h2>
      </view>
    </view>
    <view class="tab_control">
      <ul>
        <!--<li>
          <navigator>
            <view class="tab_icon"><image
                width="100%"
                height="100%"
                src="../../static/person/272@2x.png"
              ></image
            ></view>
            <text>门诊列表</text>
          </navigator>
        </li> -->
        <li>
          <navigator url="../appointmentRecord/appointmentRecord">
            <view class="tab_icon"><image width="100%" height="100%" src="../../static/person/80@2x.png"></image></view>
            <text>挂号记录</text>
          </navigator>
        </li>
        <li>
          <navigator url="../payRecord/payRecord">
            <view class="tab_icon"><image width="100%" height="100%" src="../../static/person/88@2x.png"></image></view>
            <text>住院充值记录</text>
          </navigator>
        </li>
       
      </ul>
    </view>
  </view>
</template>
<script>
export default {
  data() {
    return {
      user: {
      },
	  masking:"display:none;",
      cardID: "", //身份证号
    };
  },
  onShow() {
    this.init();
  },
  methods: {
    init() {
      let user = uni.getStorageSync("user");
      if (user) {
		  //这里需要查询用户最新信息？
		this.masking="display:none;";
        this.user = user;
        if (!user.photo) {
          user.photo = "../../static/person/338@2x.png";
        }
      } else {
		  this.masking="display:block;";
			//弹窗进行绑定信息，之后继续执行流程
			this.loginModel();
      }
    },
	loginModel(){
		//弹窗进行绑定信息，之后继续执行流程
		this.$cardInput();
	},
	hrefDetail(){
		let user = uni.getStorageSync("user");
		if(user){
			uni.navigateTo({
				url:"../medicalCard/medicalCard?kh0000="+this.user.sfzh00,
			})
		}
	},
  },
};
</script>

<style>
.masking{
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 995;
}
.top_bgk {
  background-image: url("../../static/person/335@2x.png");
  width: 100%;
  height: 100px;
}
.person_card {
  width: 96%;
  margin: 0 auto;
  margin-top: -75px;
  height: 100px;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.08);
  border-radius: 12px;
}
.person_card .person_photo {
  float: left;
  background-size: 64px 64px;
  width: 64px;
  height: 64px;
  margin-top: 18px;
  margin-left: 14px;
}
.person_card .person_message {
  float: left;
}
.person_card .person_message .person_name {
  float: left;
  font-weight: bold;
  font-size: 18px;
  margin-left: 24px;
  margin-top: 25px;
}
.person_card .person_message .person_sex {
  float: left;
  margin-top: 24px;
  margin-left: 5px;
}
.person_card .card {
  float: left;
  width: 70%;
  height: 16px;
  font-size: 16px;
  font-family: Source Han Sans CN;
  font-weight: 400;
  line-height: 27px;
  color: #999999;
  margin-left: 24px;
}
.tab_control {
  background: #ffffff;
  height: 420px;
  width: 96%;
  margin: 0 auto;
  margin-top: 10px;
  border-radius: 10px;
}
.tab_control ul {
  list-style: none;
  width: 90%;
  margin: 0 auto;
  padding: 0px;
}
.tab_control ul li {
  width: 100%;
  height: 72px;
  font-size: 14px;
  font-family: Source Han Sans CN;
  font-weight: 400;
  color: #000000;
  border-bottom: 1px solid #f0f0f0;
}
.tab_control ul li navigator {
  display: block;
  height: 100%;
}
.tab_control .tab_icon {
  width: 44px;
  height: 44px;
}
.tab_control .tab_icon image {
  float: left;
  width: 100%;
  height: 100%;
  margin-top: 15px;
}
.tab_control text {
  float: left;
  margin-top: -20px;
  margin-left: 16px;
}
</style>
